import React, { useEffect, useState} from 'react';
import ReactDOM from 'react-dom';
import {
	BrowserRouter as Router,
	Switch,
	Route,
	Link
} from "react-router-dom";
import { Footbar } from './DevicePanel/Footbar';
import { SearchPage} from './StandardBleDemo';
import sdk from 'qcloud-iotexplorer-h5-panel-sdk';
//sdk.blueToothAdapter.addAdapter(DemoBluetoothDeviceAdapter);

import './style.less';

function App() {
	const [sdkReady, setSdkReady] = useState(false);
	useEffect(() =>  {
		h5PanelSdk.sdkReady().then(() =>  setSdkReady(true));
	}, []);
	const isBluetoothDevice = true;
  const isDev = process.env.NODE_ENV !== 'production';
  //新旧链接的兼容
  const hasScf = (/\/scf\//).test(location.href)

	let basename = isDev ? `${hasScf ? '/scf' : ''}/h5panel/developing` : `${hasScf ? '/scf' : ''}/h5panel`;

  console.log('----basename----', basename);
	// 蓝牙的调试模式下路由需要加上 /live
	if (isBluetoothDevice && isDev) {
		basename += '/live';
	}

  useEffect(() => {
    sdk.on('appShow', () => console.log('appShow'))
      .on('appHide', () => console.log('appHide'))
      .on('pageShow', () => console.log('pageShow'))
      .on('pageHide', () => console.log('pageHide'));
  }, []);

	return !sdkReady ? <div > loading...</div >  : (
		<Router basename={basename}>
			<div>
				<Switch>
					{/* 蓝牙搜索页 */}
					<Route path="/bluetooth-search">
						<SearchPage/>
					</Route>
					<Route path="/">
						<Footbar />
					</Route>
				</Switch>
			</div>
		</Router>
	)
}

ReactDOM.render(<App/>, document.getElementById('app'));
